/*
 *
 * (c) Copyright Ascensio System Limited 2010-2018
 *
 * This program is freeware. You can redistribute it and/or modify it under the terms of the GNU 
 * General Public License (GPL) version 3 as published by the Free Software Foundation (https://www.gnu.org/copyleft/gpl.html). 
 * In accordance with Section 7(a) of the GNU GPL its Section 15 shall be amended to the effect that 
 * Ascensio System SIA expressly excludes the warranty of non-infringement of any third-party rights.
 *
 * THIS PROGRAM IS DISTRIBUTED WITHOUT ANY WARRANTY; WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR
 * FITNESS FOR A PARTICULAR PURPOSE. For more details, see GNU GPL at https://www.gnu.org/copyleft/gpl.html
 *
 * You can contact Ascensio System SIA by email at sales@onlyoffice.com
 *
 * The interactive user interfaces in modified source and object code versions of ONLYOFFICE must display 
 * Appropriate Legal Notices, as required under Section 5 of the GNU GPL version 3.
 *
 * Pursuant to Section 7 § 3(b) of the GNU GPL you must retain the original ONLYOFFICE logo which contains 
 * relevant author attributions when distributing the software. If the display of the logo in its graphic 
 * form is not reasonably feasible for technical reasons, you must include the words "Powered by ONLYOFFICE" 
 * in every copy of the program you distribute. 
 * Pursuant to Section 7 § 3(e) we decline to grant you any rights under trademark law for use of our trademarks.
 *
*/


@import "settings.less";

.messages {
    @border-style: @messages-border-style;
    @muted-font-color: @messages-muted-font-color;

    width: 100%;
    table-layout: fixed;

    a {
        text-decoration: none;
        color: black;
    }

    .row {
        height: @row-height;
        border-bottom: @border-style;

        .a-mixin () {
            > a {
                height: @row-height;
                line-height: @row-height;
                width: 100%;
                display: block;
                overflow: hidden;
                text-overflow: ellipsis;
            }
        }

        .centered-childs () {
            * {
                margin: auto;
                display: block;
            }
        }

        &:hover {
            background-color: @hovered-row_bg;

            .tagArrow {
                background-position: right -60px;
                background-repeat: no-repeat;
            }

            .author {
                text-decoration: underline !important;
            }
        }

        &.selected {
            background-color: @selected-row_bg;

            .tagArrow {
                background-position: right -40px;
                background-repeat: no-repeat;
            }
        }


        &.new {
            .from .author,
            .from .chain-counter,
            .subject a {
                font-weight: bold;
            }
        }
        /* zero cell padding */
        > * {
            padding: 0;
        }

        .checkbox {
            cursor: pointer;
            width: @row-height * 0.75;

            input {
                margin-left: 9px;
                float: none;
            }
        }

        .importance {
            width: @row-height;
            cursor: pointer;
            .centered-childs();
        }

        .from {
            width: @row-height * 6;
            word-wrap: break-word;
            .a-mixin();

            .author {
                max-width: @row-height * 5;
                float: left;
                height: @row-height;
                line-height: @row-height;
                display: inline-block;
                white-space: nowrap;
                overflow: hidden;
                text-overflow: ellipsis;
            }

            .chain-counter {
                padding: 0 floor((@row-height - @icon-height) / 4);
                display: inline-block;
            }
        }

        .subject {
            .a-mixin();

            a .more-tags {
                margin: 0 10px 0 5px;
                color: #333;
                cursor: pointer;
                font-weight: normal;
            }

            .tag {
                float: left;
                margin: floor((@row-height - 19px) / 2) 5px floor((@row-height - 19px) / 2) 0;
            }
        }

        .attachment {
            width: 40px;
            .a-mixin();
            .centered-childs();

            > a > [class^="icon-"], [class*=" icon-"] {
                margin-top: floor((@row-height - @icon-height) / 2);
            }
        }

        .folder {
            width: @row-height * 2;
            text-align: left;
            color: @muted-font-color;
            word-wrap: break-all;
            text-transform: capitalize;
            padding-left: @base-distance;
            .a-mixin();
        }

        .date,
        .time {
            width: @row-height * 2;
            text-align: right;
            color: @muted-font-color;
            word-wrap: break-word;
            .a-mixin();
        }

        .time {
            padding-right: floor((@row-height - @icon-height) / 2);
        }
    }
}